<!DOCTYPE html>
<html>

<head>
    <!-- 页面meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>商品管理</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <link rel="stylesheet" href="/plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/plugins/adminLTE/css/AdminLTE.css">
    <link rel="stylesheet" href="/plugins/adminLTE/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="/css/style.css">
    <script src="/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script src="/plugins/bootstrap/js/bootstrap.min.js"></script>
    <!--bootstrap-table表格引入-->
    <script src="/js/bootstrap-table/dist/bootstrap-table.js"></script>
    <script src="/js/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js"></script>
    <link href="/js/bootstrap-table/dist/bootstrap-table.css" rel="stylesheet">
    <!--        Toastr提示信息5-->
    <script src="/js/toastr/toastr.min.js"></script>
    <link href="/js/toastr/toastr.css" rel="stylesheet">
    <!--bootstrap-dialog模态框，一般用于增加修改弹出一个窗口-->
    <script src="/js/bootstrap-dialog/dist/js/bootstrap-dialog.js"></script>
    <link href="/js/bootstrap-dialog/dist/css/bootstrap-dialog.css" rel="stylesheet">

</head>

<body class="hold-transition skin-red sidebar-mini" >
<div id="toolbar">
    <form>
        <div class="form-group form-inline">
            <div class="btn-group">
                <input type="date" class="form-control" name="newsRelease" id="date1">
                <input type="date" class="form-control" name="newsRelease" id="date2">
                <button type="button" class="btn btn-info" onclick="getdata()">查询</button>
            </div>
        </div>
    </form>
</div>

<table id="table"></table>

<script>

    $('#table').bootstrapTable({
        url: '/order/getStauts',
        method: 'GET',                      //请求方式（*）
        // toolbar: '#toolbar',              //工具按钮用哪个容器
        striped: true,                      //是否显示行间隔色
        cache: true,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
        pagination: true,                   //是否显示分页（*）
        sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
        pageNumber: 1,                      //初始化加载第一页，默认第一页,并记录
        pageSize: 10,                     //每页的记录行数（*）
        pageList: [3,4,5],        //可供选择的每页的行数（*）
        showColumns: true,                  //是否显示所有的列（选择显示的列）
        showRefresh: true,                  //是否显示刷新按钮
        minimumCountColumns: 1,             //最少允许的列数
        clickToSelect: true,                //是否启用点击选中行
        height: 400,                      //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
        uniqueId: "orderId",                     //每一行的唯一标识，一般为主键列
        //得到查询的参数
        queryParams : function (params) {
            //这里的键的名字和控制器的变量名必须一致，这边改动，控制器也需要改成一样的
            var temp = {
                pagesize: params.limit,                         //页面大小
                pagenum: (params.offset / params.limit) + 1,   //页码

            };
            return temp;
        },
        columns: [{
            checkbox: true,
            visible: true                  //是否显示复选框
        }, {
            field: 'orderId',
            title: '商品ID',
        }, {
            field: 'createTime',
            title: '下单日期',
        }, {
            field: 'payment',
            title: '总金额',
        }, {
            field: 'payment',
            title: '实付金额',
        }, {
            field: 'postFee',
            title: '待支付金额',
        },{
            field:'orderId',
            title: '操作',
            width: 120,
            align: 'center',
            valign: 'middle',
            formatter:  function actionFormatter(value, row, index) {
                var id = value;
                var result = "";
                result += "<a href='javascript: updatebook("+id+") ;' class='btn btn-xs blue'  title='编辑'> <span class='glyphicon glyphicon-pencil'></span> </a>";
                result += "<a href='javascript: deletebook("+id+") ;' class='btn btn-xs red' title='删除'><span class='glyphicon glyphicon-remove'></span></a>";
                return result;
            }
        }, ]
    });

    //增加书籍信息
    function getdata() {
        var date1=$("#date1").val()
        var date2=$("#date2").val()
        //模态框
        BootstrapDialog.show({
            title: '修改新闻信息',
            message: $('<div></div>').load('/order/getdatetiao?date1='+date1+'&date2='+date2+''),//加载的页面路径
            closeable: true,
            buttons: [{
                label: '生成',
                action: function (dialog) {
                    $.ajax({
                        url:"/order/getDate",
                        type:"post",
                        dataType:"json",
                        data:{date3:$("#date3").val(),date4:$("#date4").val()},
                        async:false,
                        success:function (result){
                            console.log(result)
                            if(result.code==10000){
                                alert("成功")
                            }
                        },error:function (){
                            alert("系统异常")
                        }
                    })
                }
            }, {
                label: '关闭',
                action: function (dialog) {
                    dialog.close();
                    $('#table').bootstrapTable("refresh")
                }
            }]
        });

    }







</script>

</body>

</html>